<div nz-row>
  <div nz-col nzSpan="6"></div>
  <div nz-col nzSpan="12">
    <div style="height: 80px;"></div>
    <div class="" style="height: 40px;">
      <div nz-row nzJustify="space-around">
        <div nz-col nzSpan="4"></div>
        <div nz-col nzSpan="16"></div>
        <div nz-col nzSpan="4">
          <button nz-button nz-dropdown [nzDropdownMenu]="menu"
                  [nzPlacement]="'bottomRight'" style="float: right;">Action</button>
          <nz-dropdown-menu #menu="nzDropdownMenu">
            <ul nz-menu>
              <li nz-menu-item routerLink="/add-list">添加</li>
              <li nz-menu-item [nzDisabled]="setOfCheckedId.size === 0"
                  (click)="multipleDel()">批量删除
              </li>
            </ul>
          </nz-dropdown-menu>
        </div>
      </div>

    </div>
    <nz-table
      #rowSelectionTable
      nzShowPagination
      nzShowSizeChanger
      [nzData]="listOfData"
      (nzCurrentPageDataChange)="onCurrentPageDataChange($event)"
    >
      <thead>
      <tr>
        <th
          [nzChecked]="checked"
          [nzIndeterminate]="indeterminate"
          nzLabel="Select all"
          (nzCheckedChange)="onAllChecked($event)"
        ></th>
        <th>Name</th>
        <th>Age</th>
        <th>Action</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let data of rowSelectionTable.data">
        <td
          [nzChecked]="setOfCheckedId.has(data.id)"
          (nzCheckedChange)="onItemChecked(data.id, $event)"
        ></td>
        <td>{{ data.name }}</td>
        <td>{{ data.age }}</td>
        <td>
          <button nz-button type="primary" (click)="goUpdatePage(data)">修改</button>
          <button nz-button type="primary" (click)="del(data)">删除</button>
        </td>
      </tr>
      </tbody>
    </nz-table>
  </div>
</div>
<div nz-col nzSpan="6">

</div>
